<template>
<div style="width: 100%;height: 800px;background-color: #f2f2f2">
  <div style="height: 100px;width: 100%;">
   <div style="width: 49%;height:100px;float: left;margin-left: 15px;background-color: #ffffff">
     <img style="width: 80px;height: 80px;margin-left: 40px;margin-top: 10px" src="http://pinda.itheima.net/static/img/wd.7cc65174.png">
     <div style="width: 30%;margin-left: 160px;margin-top: -60px">
     <div><span v-text="core_org.name"></span></div>
     <div><span v-text="">北京省/北京市/昌平区/金燕龙</span></div>
     </div>
     <div style="width: 10%;float: right;margin-right: 60px;margin-top: -40px">
       <div style="width: 5%;margin-left: 25px"> <span v-text="SystemEmployeesNumber"></span></div>
       <div> <span>系统员工</span></div>
     </div>


     <div style="width: 10%;float: right;margin-right: 25%;margin-top: -40px">
       <div style="width: 5%;margin-left: 25px"> <span v-text="LowerCore_orgNumber"></span></div>
       <div> <span>下属机构</span></div>
     </div>

   </div>
   <div style="width: 49%;height: 100px;float: right;background-color: #ffffff">
    <div style="width: 25%;height: 55%;margin-top: 18px;margin-left: 45px;float: left">
      <div style="float: left;width: 80px;height: 55px">  <el-icon name="  el-icon-s-scale "/>
      </div>
      <div style="width: 30px;margin-left: 90px"><span v-text="NoRange"></span></div>
      <div style="width: 115px;margin-left: 90px;margin-top: 10px">待分配作业范围</div>
    </div>

     <div style="width:25%;height: 55%;margin-top: 18px;margin-left: 60px;float: left">
       <div style="float: left;width: 80px;height: 55px">  <el-icon name="  el-icon-s-scale "/>
       </div>
       <div style="width: 30px;margin-left: 90px"><span v-text="qujiandaibanNumber"></span></div>
       <div style="width: 115px;margin-left: 90px;margin-top: 10px">取件代办</div>
     </div>

     <div style="width: 25%;height: 55%;margin-top: 18px;margin-right: 40px;float: right">
       <div style="float: left;width: 80px;height: 55px">  <el-icon name="  el-icon-s-scale "/>
       </div>
       <div style="width: 30px;margin-left: 90px"><span v-text="paijiandaibanNumber"></span></div>
       <div style="width: 115px;margin-left: 90px;margin-top: 10px">派件代办</div>
     </div>

   </div>
 </div>
  <div style="height: 350px;margin-top: 15px">
    <div style="width: 49%;height:330px;margin-left: 15px;float: left;background-color: #ffffff">
<span>订单总量</span>
<zzt></zzt>
    </div>
    <div style="width: 49%;height: 330px;float: right;background-color: #ffffff">
    <biaojiDiTu></biaojiDiTu>
    </div>
  </div>
  <div style="height: 330px;margin-left: 15px;background-color: #ffffff">
    <div style="width: 55%;height: 330px;float: left">
      <div style="width: 80px;height:20px;;margin-top: 15px;margin-left: 10px"><span>作业信息</span></div>
      <div style="width: 89%;height: 200px;margin-top: 30px;margin-left: 15px">
        <div style="width: 110px;height: 200px;margin-left: 15px;float: left">
          <div class="DivZy">
            <div>1001</div>
            <div>取件任务</div>
          </div>
          <div  class="DivZy">
            <div>1001</div>
            <div>取件任务</div>
          </div>
          <div  class="DivZy">
            <div>1001</div>
            <div>取件任务</div>
          </div>
        </div>
        <div style="width: 570px;height: 200px;float: left">
          <div style="width: 30%;height: 200px;margin-left: 20px;float: left">
            <div style="height: 60px;margin-top: 15px">
              <div>111</div>
              <div>取件任务带派遣</div>
            </div>
            <div style="height: 60px">
              <div>111</div>
              <div>取件任务带派遣</div>
            </div>
            <div style="height: 60px">
              <div>111</div>
              <div>取件任务带派遣</div>
            </div>
          </div>
          <div style="width: 30%;height: 200px;margin-left: 10px;float: left">
            <div style="height: 60px;margin-top: 15px">
              <div>111</div>
              <div>取件任务带派遣</div>
            </div>
            <div style="height: 60px">
              <div>111</div>
              <div>取件任务带派遣</div>
            </div>
            <div style="height: 60px">
              <div>111</div>
              <div>取件任务带派遣</div>
            </div></div>
          <div style="width: 30%;height: 200px;float: right">
            <div style="height: 60px;margin-top: 15px">
              <div>111</div>
              <div>取件任务带派遣</div>
            </div>
            <div style="height: 60px">
              <div>111</div>
              <div>取件任务带派遣</div>
            </div>
            <div style="height: 60px">
              <div>111</div>
              <div>取件任务带派遣</div>
            </div></div>
        </div>
      </div>
    </div>
     <div style="float: left;width: 25%;margin-top: 90px;margin-left: 45px">
       <yuan></yuan>
     </div>
    <div style="width: 15%;height: 330px;float: left;margin-left: -90px">
      <div style="margin-top: 90px">
        <div>144</div>
        <div>取件任务待派遣</div>
      </div>
      <div style="margin-top: 20px">
        <div>144</div>
        <div>取件任务待派遣</div>
      </div>
      <div style="margin-top: 20px">
        <div>144</div>
        <div>取件任务待派遣</div>
      </div>
    </div>
  </div>
</div>



</template>
<script >
 import zzt from "@/views/indexdata/ZhuZhuangTu.vue"
import biaojiDiTu from "@/views/indexdata/BiaojiDiTu.vue";
 import yuan from "@/views/dataview/Yuan.vue";

 import { queryCoreByuserId,queryByPerantId,userByOrgId } from '@/api/organ/Organ'
 import user from '@/store/modules/user'
 import { GetExpressItemByOrderId_to, Query, QueryCount, QueryCountCore } from '@/api/indexView/indexView'
export default {

  components: {
    zzt,
    biaojiDiTu,
    yuan
  },
  data(){
return{
  qujiandaibanNumber:"0",
  paijiandaibanNumber:"0",
  NoRange:"",
  LowerCore_orgNumber:"",
  SystemEmployeesNumber:"",
  core_org:{
    id:"",
    name:"",
    abbreviation:"",
    parent_id:"",
    org_type:"",
    province_id:"",
    city_id:"",
    county_id:"",
    address:"",
    contract_number:"",
    manager_id:"",
    tree_path:"",
    sort_value:"",
    status:"",
    describe:"",
    latitude:"",
    longitude:"",
    business_hours:"",
    create_user:"",
    update_time:"",
    update_user:"",
  },
}
  },
  created() {
      this.info();
      this.CoreNumber();




    },
  methods:{

    info(){
      queryCoreByuserId(user.state.id).then(res=>{
        this.core_org=res;
        Query(this.core_org.id).then(res=>{
          console.log(res)
          this.LowerCore_orgNumber=res.length;

        })
        console.log(this.core_org)
        const postData = {
          org_id:this.core_org.id,
          pageSize: this.pageSize,
          pageNum: this.currentPage,
        };
        userByOrgId(postData).then(res=>{
          this.SystemEmployeesNumber=res.data.total;
        })

        GetExpressItemByOrderId_to(this.core_org.id).then(res=>{
       this.qujiandaibanNumber=res.data.numbers;
      this.paijiandaibanNumber=res.data.numbers_to;
        })
      })



    },


    CoreNumber(){
      QueryCountCore().then(res1=>{
        QueryCount().then(res2=>{
             this.NoRange=res1-res2
        })
      })

    }

  }
}
</script>
<style scoped>


.DivZy{
  margin-top: 15px
}

</style>
